﻿$(document).ready(function(){

var jVal = {
	'jValName' : function() {
		$('form').append('<div id="nameInfo" class="info"></div>');
		var nameInfo = $('#nameInfo');
		var ele = $('#Name');
		var pos = ele.offset();
		nameInfo.css({ top: pos.top});
		
		if (hasInDB()) {
			jVal.errors = true;
			jVal.Name_keyup = true;
				nameInfo.removeClass('icon_okay').addClass('icon_wrong')
					.html(' name already exists!').show();
				ele.removeClass('normal').addClass('wrong');
		} else if(ele.val() == "") {
			jVal.errors = true;
			jVal.Name_keyup = true;
				nameInfo.removeClass('icon_okay').addClass('icon_wrong')
					.html(' name is required!').show();
				ele.removeClass('normal').addClass('wrong');
		} else if(ele.val().length < 6 || ele.val().length > 20) {
			jVal.errors = true;
			jVal.Name_keyup = true;
				nameInfo.removeClass('icon_okay').addClass('icon_wrong')
					.html(' length should\'t less then 6 and more then 20!').show();
				ele.removeClass('normal').addClass('wrong');
		} else {
			jVal.Name_keyup = true;
				nameInfo.removeClass('icon_wrong').addClass('icon_okay').html('').show();
				ele.removeClass('wrong').addClass('normal');
		}
	},
	
	/*'jValIdNumber' : function (){
		$('form').append('<div id="id_number" class="info"></div>');
		var id_number = $('#id_number');
		var ele = $('#IDNumber');
		var pos = ele.offset();
		id_number.css({ top: pos.top, left: pos.left+ele.width()+15 });
		var patt = /^[0-9]{4}$/i;
		if(ele.val() == "") {
			jVal.errors = true;
			jVal.IDNumber_keyup = true;
				id_number.removeClass('icon_okay').addClass('icon_wrong').html(' ID Number is required!').show();
				ele.removeClass('normal').addClass('wrong');
		} else if(!patt.test(ele.val())) {
			jVal.errors = true;
			jVal.IDNumber_keyup = true;
				id_number.removeClass('icon_okay').addClass('icon_wrong').html(' please enter correct id!').show();
				ele.removeClass('normal').addClass('wrong');					
		} else {
			jVal.IDNumber_keyup = true;
				id_number.removeClass('icon_wrong').addClass('icon_okay').html('').show();
				ele.removeClass('wrong').addClass('normal');
		}	
	},*/
	
	'jValPassword' : function() {
		$('form').append('<div id="password" class="info"></div>');
		var password = $('#password');
		var ele = $('#Password');
		var pos = ele.offset();
		password.css({ top: pos.top/*, left: pos.left+ele.width()+15*/ });
		if(ele.val() == "") {
			jVal.errors = true;
			jVal.Password_keyup = true;
				password.removeClass('icon_okay').addClass('icon_wrong').html(' password is required!').show();
				ele.removeClass('normal').addClass('wrong');
		} else if(ele.val().length < 6 || ele.val().length > 20) {
			jVal.errors = true;
			jVal.Password_keyup = true;
				password.removeClass('icon_okay').addClass('icon_wrong')
					.html(' length should\'t less then 6 and more then 20!').show();
				ele.removeClass('normal').addClass('wrong');				
		} else {
			jVal.Password_keyup = true;
				password.removeClass('icon_wrong').addClass('icon_okay').html('').show();
				ele.removeClass('wrong').addClass('normal');
		}
	},
	
	'jValCellNumber' : function (){
		$('form').append('<div id="cell_number" class="info"></div>');
		var cell_number = $('#cell_number');
		var ele = $('#CellNumber');
		var pos = ele.offset();
		cell_number.css({ top: pos.top/*, left: pos.left+ele.width()+15*/ });
		var patt = /^[0-9]{3}\-[0-9]{3}\-[0-9]{2}\-[0-9]{2}$/i;
		if(ele.val() == "") {
			jVal.errors = true;
			jVal.CellNumber_keyup = true;
				cell_number.removeClass('icon_okay').addClass('icon_wrong').html(' cell number is required!').show();
				ele.removeClass('normal').addClass('wrong');
		} else if(!patt.test(ele.val())) {
			jVal.errors = true;
			jVal.CellNumber_keyup = true;
				cell_number.removeClass('icon_okay').addClass('icon_wrong')
					.html(' please enter correct cell number!').show();
				ele.removeClass('normal').addClass('wrong');					
		} else {
			jVal.CellNumber_keyup = true;
				cell_number.removeClass('icon_wrong').addClass('icon_okay').html('').show();
				ele.removeClass('wrong').addClass('normal');
		}	
	},
	
	'jValCardNumber' : function (){
		$('form').append('<div id="card_number" class="info"></div>');
		var card_number = $('#card_number');
		var ele = $('#CardNumber');
		var pos = ele.offset();
		card_number.css({ top: pos.top });
		var patt = /^[0-9]{4}\-[0-9]{4}\-[0-9]{4}\-[0-9]{4}$/i;
		
		if(ele.val() == "") {
			jVal.errors = true;
			jVal.card_error = true;
			jVal.CardNumber_keyup = true;
				card_number.removeClass('icon_okay').addClass('icon_wrong').html(' card number is required!').show();
				ele.removeClass('normal').addClass('wrong');
		} else if(!patt.test(ele.val()) && ele.val() != "" && ele.val() != null) {
			jVal.errors = true;
			jVal.card_error = true;
			jVal.CardNumber_keyup = true;
				card_number.removeClass('icon_okay').addClass('icon_wrong')
					.html(' please enter correct card number!').show();
				ele.removeClass('normal').addClass('wrong');					
		} else {
			jVal.card_error = false;
			jVal.CardNumber_keyup = true;
				card_number.removeClass('icon_wrong').addClass('icon_okay').html('').show();
				ele.removeClass('wrong').addClass('normal');
		}
		if (!$('#addedCards:empty').length)
			setTimeout(function(){card_number.fadeOut('normal');}, 2000);
	},
	
	'jValAddedCards' : function (){
		$('form').append('<div id="added_cards" class="info"></div>');
		var added_cards = $('#added_cards');
		var ele = $('#addedCards');
		var pos = ele.offset();
		added_cards.css({ top: pos.top-110, "margin-left" : 450 });
		if($('#addedCards:empty').length) {
			jVal.errors = true;
			added_cards.removeClass('icon_okay').addClass('icon_wrong').html(' add one or more cards!').show();
			ele.removeClass('normal').addClass('wrong');
		} else {
			added_cards.removeClass('icon_wrong').addClass('info').html('').show();
			ele.removeClass('wrong').addClass('normal');
		}	
	},
	
};
// ====================================================== //
$('#addCard').click(function (){
	jVal.jValCardNumber();
	var card_number = $('#card_number');
	if(!jVal.card_error) {
		var appendText = "";
		var cardType = $("#CardType", "#creditCards").val();
		var cardNumber = $("#CardNumber", "#creditCards").val();
		var cardTypes = ["", "Visa", "Mastercard", "AmericanExpress", "Edgars", "BP"];
		$.each(cardTypes, function(i, type){
			if (cardType == i){
				appendText += '<div class="control-group">';
				appendText += '<label class="control-label" for="CardTypes">Card type</label>';
				appendText += '<div class="controls">';
				appendText += '<input type="text" name="CardTypes" value="' + type + '" readonly>';
				appendText += '</div>';
				appendText += '</div>';
				appendText += '<div class="control-group">';
				appendText += '<label class="control-label" for="CardNumbers">Card number</label>';
				appendText += '<div class="controls">';
				appendText += '<input type="text" name="CardNumbers" value="' + cardNumber + '" readonly>';
				appendText += '</div>';
				appendText += '</div>';
			}
		});
		jVal.card_added = true;
		$("#addedCards").append(appendText);
		jVal.jValAddedCards();
			card_number.removeClass('icon_okay').html('').show();
		var card__number = $('#CardNumber');
			card__number.val("");
	}
	setTimeout(function(){card_number.fadeOut('normal');}, 2000);
});

$('#send').click(function (){
		jVal.errors = false;
		jVal.jValName();
		/*jVal.jValIdNumber();*/
		jVal.jValPassword();
		jVal.jValCellNumber();
		/*jVal.jValCardNumber();*/
		jVal.jValAddedCards();
	if (jVal.errors == true){
		scroll_to_elem("Name", 1200);
		return false;
	}
		
});
//====================================================== //
//NAME
$('#Name').keyup(function (){
	if(jVal.Name_keyup)
		jVal.jValName();
});
/*$('#Name').blur(function (){
	jVal.jValName();
	jVal.Name_keyup = true;
});*/
/*//IDNumber
$('#IDNumber').keyup(function (){
	if(jVal.IDNumber_keyup)
		jVal.jValIdNumber();
});
$('#IDNumber').blur(function (){
	jVal.jValIdNumber();
	jVal.IDNumber_keyup = true;
});*/
//PASSWORD
$('#Password').keyup(function (){
	if(jVal.Password_keyup)
		jVal.jValPassword();
});
/*$('#Password').blur(function (){
	jVal.jValPassword();
	jVal.Password_keyup = true;
});*/
//CELLNUMBER
$('#CellNumber').keyup(function (){
	if(jVal.CellNumber_keyup)
		jVal.jValCellNumber();
});
/*$('#CellNumber').blur(function (){
	jVal.jValCellNumber();
	jVal.CellNumber_keyup = true;
});*/
//CARDNUMBER
$('#CardNumber').keyup(function (){
	if(jVal.CardNumber_keyup);
		jVal.jValCardNumber();
});
/*$('#CardNumber').blur(function (){
	jVal.jValCardNumber();
	jVal.CardNumber_keyup = false;
});*/
//====================================================== //
$('#Name').change(jVal.jValName);
/*$('#IDNumber').change(jVal.jValIdNumber);*/
$('#Password').change(jVal.jValPassword);
$('#CellNumber').change(jVal.jValCellNumber);
$('#CardNumber').change(jVal.jValCardNumber);
$('#addedCards').change(jVal.jValAddedCards);
//====================================================== //
});


//Прокрутка страницы к заданному элементу с заданной скоростью
function scroll_to_elem(elem, speed) {
	if(document.getElementById(elem)) {
		var destination = jQuery('#'+elem).offset().top;
		jQuery("html,body").animate({scrollTop: destination}, speed);
	}
}

//Ajax + JSON + Проверка введенного имени с именами в БД
function hasInDB() {
	
	has_in_db = false;
	var user_name = $('#Name').val();
	var user_password = $('#Password').val();
	var cell_number = $('#CellNumber').val();
	var card_types = [], card_numbers = [];
	
	var addedCardTypes = [ $('input[name="CardTypes"]') ];
	$.each(addedCardTypes, function(i, entry) {
		$.each(entry, function(y, value) {
			card_types[y] = value['value'];
		});
	});
	var addedCardNumbers = [ $('input[name="CardNumbers"]') ];
	$.each(addedCardNumbers, function(i, entry) {
		$.each(entry, function(y, value) {
			card_numbers[y] = value['value'];
		});
	});
	
	$.ajax({
		url : context+"/user/hasInDB",
		type : "POST",
		data : "user_name=" + user_name + "&user_password=" + user_password + "&cell_number=" + cell_number 
				+ "&card_types=" + card_types + "&card_numbers=" + card_numbers,
		dataType: "json",
		async : false,
		success: function(data){
			$.each(data, function(entryIndex, entry) {
				if(entryIndex == "has_in_db" && entry == true)
					has_in_db = true;
			});
		},
		error : function() {
			alert('error!');
		}
	});
	
	return has_in_db;
}